

import { createApp } from 'vue'
import { createPinia } from 'pinia'

import App from './App.vue'
import router from './router'

import {getCategoryAPI} from '@/apis/testAPI'

import './styles/common.scss'
import { useIntersectionObserver } from '@vueuse/core'
getCategoryAPI().then(res => {
  console.log(res)
})
const app = createApp(App)

app.use(createPinia())
app.use(router)

app.mount('#app')

app.directive(
  'img-lazy',
  {
    mounted(el, binding) {
      // el: 指令绑定的元素
      // binding: 指令相关的信息对象
      // console.log(el, binding)
      const { stop } = useIntersectionObserver(
        el,
        ([{ isIntersecting }]) => { console.log(isIntersecting)
          if (isIntersecting) {
            el.src = binding.value
            stop()
          }
        },
        
      )
    }
  }
)
